define([
  'views/List',
  'views/Item',
  'hbs!template/users/inbox/inbox-list',
  'hbs!template/users/inbox/inbox-item',
  'hbs!template/users/outbox/outbox-list',
  'hbs!template/users/outbox/outbox-item'
], function(List, Item, inbox_list, inbox_item, outbox_list, outbox_item){
  var InboxItem = Item.extend({
    tagName: "tr",
    className: "inbox-item",
//    template: inbox_item,

    events: {
      "click input[name=selection]":       "selection"
    },
    
    initItem: function(options) {
      options || (options = {});
      if(options.flags && options.flags.type == "inbox") {
        this.template = inbox_item;
      } else {
        this.template = outbox_item;
      }
      this.model.bind("change", this.render, this);
      this.model.bind("selected", this.render, this);
      this.model.bind("unselected", this.render, this);
    },

    getRenderData: function() {
      var data = Item.prototype.getRenderData.call(this);
      data._selected = this.model.getSelected();
      return data;
    },

    selection: function() {
      var selected = this.model.getSelected();
      this.model.setSelected(!selected);
    }
  });

  var InboxList = List.extend({
    tagName: "div",
    className: "inbox-list",
//    template: inbox_list,
    itemView: InboxItem,

    listEvents: {
      "click button[name=back]":        "back",
      "click a[name=check-all]":        "checkAll",
      "click a[name=uncheck-all]":      "unCheckAll",
      "click a[name=delete]":           "deleteSelected",
      "click a[name=unread]":           "unread",
      "click a[name=read]":              "read"
    },

    initList: function(options) {
      options || (options = {});
      if(options.type === 'inbox') {
        this.inbox = true;
        this.template = inbox_list;
      } else {          
        this.inbox = false;
        this.template = outbox_list;
      }
      this.collection.bind("item:selected", this.render, this);
      this.collection.bind("item:unselected", this.render, this);
      //this.collection.bind("all", this.render, this);
    },

    render: function() {
      var flags = {};
      
      flags.type = this.inbox ? "inbox" : "outbox";
        
      this.renderList(flags);
      
      return this;
    },
    
    checkAll: function() {
      this.collection.each(function(inbox){
        inbox.setSelected(true);
      });
    },

    unCheckAll: function() {
      this.collection.each(function(inbox){
        inbox.setSelected(false);
      });
    },

    getRenderData: function() {
      var data = List.prototype.getRenderData.call(this);
      data._selections = false;
      this.collection.each(function(inbox) {
        if(inbox.getSelected()) {
          data._selections = true;
        }
      });

      return data;
    },

    deleteSelected: function() {
      console.log("Deleting selected items.");
      var selected = this.collection.filter(function(inbox){
        return inbox.getSelected();
      });
      //console.log(selected);
      //this.collection.remove(selected);
      for(var i=0, counter=selected.length; i < counter; i++) {
        selected[i].destroy();
      }

      //this.collection.fetch();
    },

    read: function() {
      this.collection.each(function(inbox){
        if(inbox.getSelected()) {
          inbox.save({readed: true});
        }
      });
    },

    unread: function() {
      this.collection.each(function(inbox){
        if(inbox.getSelected()) {
          inbox.save({readed: false});
        }
      });
    }
    
  });

  return InboxList;
});